import React from 'react'
import { Form, Radio } from 'antd'
import { formItemLayout } from '../BaseFilter'

const RaceLevelFilter: React.FC = () => (
    <Radio.Group defaultValue="all" buttonStyle="solid">
        <Radio.Button value="all">全部</Radio.Button>
        <Radio.Button value="school">校级</Radio.Button>
        <Radio.Button value="city">市级</Radio.Button>
        <Radio.Button value="province">省级</Radio.Button>
        <Radio.Button value="country">国家级</Radio.Button>
    </Radio.Group>
)

const RaceTypeFilter: React.FC = () => (
    <Radio.Group defaultValue="all" buttonStyle="solid">
        <Radio.Button value="all">全部</Radio.Button>
        <Radio.Button value="science">学科竞赛</Radio.Button>
        <Radio.Button value="city">数学建模</Radio.Button>
        <Radio.Button value="province">计算机</Radio.Button>
        <Radio.Button value="country">软件设计</Radio.Button>
    </Radio.Group>
)

const ItemOrderFilter: React.FC = () => (
    <Radio.Group defaultValue="all" buttonStyle="solid">
        <Radio.Button value="all">显示全部</Radio.Button>
        <Radio.Button value="newest">最新发布</Radio.Button>
        <Radio.Button value="signTime">报名时间</Radio.Button>
        <Radio.Button value="endTime">截止时间</Radio.Button>
    </Radio.Group>
)

export class RaceFilterForm extends React.Component<any, any> {
    render () {
        return (
            <>
                <Form {...formItemLayout} >
                    <Form.Item label='类别'>
                        <RaceTypeFilter/>
                    </Form.Item>
                    <Form.Item label='赛级'>
                        <RaceLevelFilter/>
                    </Form.Item>
                    <Form.Item label='排序方式'>
                        <ItemOrderFilter/>
                    </Form.Item>
                </Form>
            </>
        )
    }
}
